@charset "utf-8";
/* CSS Document */

.contentbg{
	width:85%;
	height:1200px;
	margin-left:auto;
	margin-right:auto;
	background-color:rgba(255,255,204,0.2);
}

.content1{
	width:36%;
	height:450px;
	margin-left:8%;
	margin-bottom:10%;
	float:left;
}

.content1 img{
	width:100%;
	height:auto;
	overflow:hidden;
	margin-bottom:5px;
}

.content2{
	width:43%;
	height:auto;
	float:left;
	margin-top:10%;
	margin-left:7%;
	margin-bottom:20px;
	border:5px solid #666;
}

.title{
	width:100%;
	height:50px;
	margin-top:10%;
}

.title h1{
	font-family: 'Open Sans Condensed', sans-serif;
	font-size:38px;
	font-weight:400;
	color:#333;
	float:right;
	margin-right:15%;
}

.text1{
	width:85%;
	height:auto;
	margin:0 auto;
	margin-top:10%;
	margin-bottom:10%;
}

.text1 h2{
	font-family: 'Open Sans Condensed', sans-serif;
	font-size:22px;
	font-weight:400;
	color:#333;
	margin-left:20px;
	margin-top:-10px;

}

.text1 p{
	font-family:'Roboto Condensed', sans-serif;
	font-size:16px;
	font-weight:400;
	padding:5px 15px 30px 15px;
	color:#333;
	line-height:25px;
	text-align:justify;
}


@media screen and (max-width: 1920px) and (min-width: 1600px) {
	.contentbg{
		width:80%;
		height:auto;
		height:1100px;
	}
	
	.content1{
		width:35%;
		height:350px;
		float:left;	
	}
	
	.content2{
		width:35%;
		height:auto;
		float:left;
		margin-left:10%;
	}

}


@media only screen and (max-width: 1200px) and (min-width: 901px),
 only screen and (max-width: 900px) and (min-width: 769px) {
	.contentbg{
		width:100%;
		height:auto;
		height:1100px;
	}
	
	.content1{
		width:35%;
		height:350px;
		float:left;	
	}
	
	.content2{
		width:45%;
		height:auto;
		float:left;
	}

}

@media only screen and (max-width: 768px) and (min-width: 481px){
	.contentbg{
		width:100%;
		height:1000px;
	}
	
	.content1{
		width:40%;
		height:400px;
		float:left;
		margin-left:5%;	
	}
	
	.content2{
		width:45%;
		height:auto;
		float:left;
		margin-left:5%;
	}
	
	.title h1{
		width:88%;
		font-size:30px;
		float:left;
		text-align:left;
		margin-left:13%;
	}
	
}

@media only screen and (max-width: 480px) and (min-width: 321px){
	.contentbg{
		width:100%;
		height:1300px;
	}
	
	.content1{
		width:75%;
		height:auto;
		float:left;	
		margin-left:15%;
	}
	
	.content2{
		width:75%;
		height:auto;
		float:left;
		margin-left:15%;
	}
	
	.title{
		height:40px;
	}
	
	.title h1{
		width:88%;
		font-size:30px;
		float:left;
		text-align:left;
		margin-left:10%;
	}
	
	.text1{
		width:90%;
		height:auto;
	}

}
	
@media only screen and (max-width: 320px){
	.contentbg{
		width:100%;
		height:1300px;
	}
	
	.content1{
		width:80%;
		height:400px;
		float:left;	
		margin-left:11%;
	}
	
	.content2{
		width:80%;
		height:auto;
		float:left;
		margin-left:11%;
	}
	
	.title{
		height:40px;
	}
	
	.title h1{
		font-size:24px;
		float:left;
		text-align:left;
		margin-left:8%;
	}
	
	.text1{
		width:95%;
		height:auto;
	}
	
	.text1 h2{
		font-size:21px;
	}

}